
Page({
    /**
     * 页面的初始数据
     */
    data: {
        succ: true,
        isActive: true,
        qrcodePath: '', //生成的二维码
        Artwidth: "",
        Artheight: "",
        w: 400,
        h: 300,
        dpr: 2,
        name: '1236666',
        window_heigt: '', //屏幕高度
        window_width: '', //屏幕宽度
        imgs: 'https://feiyangimage.oss-cn-shanghai.aliyuncs.com/severs_ke_cs.png',
        headImgurls: '',//头像
        isRemark: '',
        imgcodeUrl: ''
    },

    onLoad(options) {
        const that = this
        let imgCode = options.imgCode ? options.imgCode : ''
        var str = imgCode.split(':')
        var headApply = 'https:'
        var imgcodeUrl = headApply + str[1]
        console.log(imgcodeUrl, "6666666")
        this.setData({
            imgcodeUrl
        })

    },
  
    // 返回上一层
    back_go() {
        const pages = getCurrentPages();
        const prevPage = pages[pages.length - 2]; //上一个页面
        // 从朋友圈进入的时候，页面栈为空，这里需要判断是否有上个页面
        if (prevPage) {
            wx.navigateBack({
                delta: 1
            })
        } else {
            wx.redirectTo({
                url: '/pages/index/index',
            })
        }
    },

    onReady() {
        const that = this
        wx.getSystemInfo({
            success: function (res) {
                that.setData({
                    window_heigt: res.windowHeight,
                    window_width: res.windowWidth
                }, () => {
                    that.changemax1()
                })
            },
        })

    },

    //画布盒子
    changemax1() {
        let w = 0
        let h = 0
        let that = this
        console.log("进来第一步")
        const query = wx.createSelectorQuery().in(this)
        query.select("#Articulation6").fields({
            node: true,
            size: true,
            rect: true
        }).exec(res => {
            // const {
            //     node: canvas
            // } = res[0];
            console.log("进来第二步")
            const canvas = res[0].node
            that.canvas = canvas
            // wx.downloadFile({
            //     url: that.data.imgs,
            //     success: function (ress) {
            // console.log(ress, "6666")
            wx.getImageInfo({
                src: that.data.imgs,//背景海报
                success: function (res) {
                    // 显示在屏幕上的尺寸
                    w = that.data.window_width - 30
                    h = (w / res.width * res.height)
                    console.log(res, "55588822222222")
                    const dataInfo = that.scaleValue(0, 0, w, h, 2)
                    dataInfo.then((ress) => {
                        canvas.width = ress.w     //背后的大图片
                        canvas.height = ress.h
                        console.log(ress, "ressressressressress")
                        //展示的画布
                        that.setData({
                            Artwidth: w,
                            Artheight: h
                        })
                        const ctx = canvas.getContext('2d');
                        const bgimage = canvas.createImage()
                        //自己上传图片
                        bgimage.src = that.data.imgs
                        bgimage.onload = () => {
                            ctx.drawImage(bgimage, 0, 0, canvas.width, canvas.height)   //背景海报绘制
                            ctx.scale(that.data.dpr, that.data.dpr);

                            //  二维码--------------------------------------------------------------------------------------------
                            wx.getImageInfo({
                                src: that.data.imgcodeUrl,//背景海报
                                success: function (ress) {
                                    //绘制
                                    const ctx = canvas.getContext('2d');
                                    // ctx.fillStyle = 'pink'
                                    /* 设置字体样式 大小 字体类别 */
                                    ctx.font = 'normal 400 17px PingFangSC-Regular'
                                    const erwmaimage = canvas.createImage()
                                    var txtWidth = ctx.measureText(that.data.name).width

                                    console.log(txtWidth, "txtWidthtxtWidthtxtWidth")
                                    //自己上传图片
                                    ctx.textAlign = "center"
                                    console.log(h / 2.0, "h / 2.0h / 2.0h / 2.0")
                                    if (that.data.isRemark) {
                                        ctx.fillText(that.data.name, w / 2, h / 1.58)
                                    }

                                    erwmaimage.src = ress.path
                                    erwmaimage.onload = () => {

                                        ctx.drawImage(erwmaimage, w / 3.2, h / 2.5, w / 2.7, w / 2.7)


                                        ctx.scale(that.data.dpr, that.data.dpr);
                                        that.setData({
                                            isActive: false
                                        })

                                    }
                                }
                            })
                        }
                    })
                }



            })
            //     }
            // })

        })
    },
    //同比放大绘制的内容，目的为了高清
    scaleValue(x, y, w, h, dpr) {
        return new Promise((resolve, reject) => {
            const data = {
                x: x * dpr,
                y: y * dpr,
                w: w * dpr,
                h: h * dpr,
            }
            resolve(data)
        })
    },
    //  合成
    savePhoto() {
        var that = this
        wx.showLoading({
            title: '正在保存',
            mask: true
        })
        setTimeout(() => {
            wx.canvasToTempFilePath({
                canvas: this.canvas,
                x: 0, //指定的画布区域的左上角横坐标	
                y: 0, //指定的画布区域的左上角纵坐标	

                fileType: 'jpg',
                quality: 3,
                success: function (res) {
                    // console.log(res, "555555555555555555555555555555")
                    let tempFilePath = res.tempFilePath
                    // 保存到相册
                    wx.saveImageToPhotosAlbum({
                        filePath: tempFilePath,
                        success(res) {
                            wx.hideLoading()
                            wx.showModal({
                                title: '温馨提示',
                                content: '图片保存成功，可在相册中查看',
                                showCancel: false,
                                success(res) {
                                    wx.clear
                                    if (res.confirm) {
                                        that.setData({
                                            isShow: true
                                        })
                                    }
                                },
                                fail(res) {
                                    wx.hideLoading()
                                    wx.showModal({
                                        title: '温馨提示',
                                        content: '图片保存失败，请重试',
                                        showCancel: false
                                    })
                                }
                            })

                        }, fail(res) {
                            wx.hideLoading()
                            if (res.errMsg == "saveImageToPhotosAlbum:fail auth deny") {
                                wx.hideLoading()
                                wx.showModal({
                                    title: '检测到您没有打开保存到相册的权限，是否前往设置打开？',
                                    success: (res) => {
                                        if (res.confirm) {
                                            that.onOpenSetting() // 打开设置页面          
                                        } else if (res.cancel) {

                                        }
                                    }
                                })

                            }
                        }
                    })
                }, fail(res) {
                    wx.hideLoading()

                }

            })

        }, 500)

    },
    //打开设置，引导用户授权
    onOpenSetting() {
        var that = this
        wx.openSetting({
            success: (res) => {
                if (!res.authSetting['scope.writePhotosAlbum']) {
                    wx.showToast({
                        title: '您未授权',
                        icon: 'none',
                        duration: 1500
                    })
                    that.setData({// 拒绝授权
                        isAuthSavePhoto: true
                    })

                } else {// 接受授权
                    that.setData({
                        isAuthSavePhoto: false
                    })
                    that.savePhoto()// 接受授权后保存图片

                }

            }
        })

    },

})